import type { Ref } from 'vue'
//实现路由切换时，滚动条自动恢复位置的hook
export function useScrollRecover(el?: Ref<HTMLElement | undefined>) {
    if(!el) el=ref(document.body)
    // 用于记录滚动位置的变量
    const scrollTop = ref(0)

    // 跳转路由守卫
    onBeforeRouteLeave((to, from, next) => {
        // 将当前位置进行一个保存
        scrollTop.value = unref(el)?.scrollTop || 0
        next()
    })

    // keep-alive激活时会自动调用actived钩子，此时将容器的滚动高度设置为记录的值
    onActivated(() => {
        if (unref(el))
            (unref(el) as HTMLElement).scrollTop = unref(scrollTop)
    })

}